<div nz-col [nzLg] = "{span: 9}" [nzMd] = "{span: 9}" [nzSm] = "{span: 24}" [nzXs] = "{span: 24}" >
  <div nz-row style="margin-top: 40px">

    <div nz-col [nzSpan] = "12"  style="background-color: #ed6b75;height:160px;color: white">
      <div nz-row  style="margin-right: 1em">
          <div nz-col [nzSpan] = "6"  [nzOffset]="2">
             <i class="anticon anticon-bar-chart line1-ico"></i>
          </div>
          <div nz-col [nzSpan] = "16"  >
            <p class="line1-text-up text-right">今日交易总数&nbsp;</p>
            <p class="line1-text-down text-right" >3.2&nbsp;<span style="font-size: 0.5em;">万&nbsp;</span></p>
          </div>
      </div>
    </div>

    <div nz-col [nzSpan] = "11"  [nzOffset]="1" style="background-color: #36c6d3;height:160px;color: white">
      <div nz-row  style="margin-right: 1em">
        <div nz-col [nzSpan] = "6"  [nzOffset]="2">
          <i class="anticon anticon-pay-circle line1-ico"></i>
        </div>
        <div nz-col [nzSpan] = "16"  >
          <p class="line1-text-up text-right">今日交易总额&nbsp;</p>
          <p class="line1-text-down text-right" >5.6&nbsp;<span style="font-size: 0.5em;">万&nbsp;</span></p>
        </div>
      </div>
    </div>

  </div>

  <div nz-row style="margin-top: 40px;height:350px;background-color: white">

      <div nz-col [nzSpan] = "8"  style="padding-top: 10px">
        <span style="font-size: 1.6em;padding-left: 1.6em">访问量/销售量阶段性统计</span>
      </div>
      <div nz-col [nzSpan] = "16"  style="padding-top: 10px">
        <nz-datepicker [(ngModel)]="_date" [nzPlaceHolder]="'Select date'" [nzDisabledDate]="_disabledDate" (click)="handelChange()"></nz-datepicker>
        <button nz-button [nzType]="'default'" class="tab-btn" (click)="select_year()">年</button>
        <button nz-button [nzType]="'default'" class="tab-btn" (click)="select_month()">月</button>
        <button nz-button [nzType]="'default'" class="tab-btn" (click)="select_week()">周</button>
      </div>


      <div nz-col [nzSpan] = "24" id="year_month_week" class="chart-div" ></div>

  </div>


  <div nz-row style="margin-top: 40px">
    <div nz-col [nzSpan] = "24"  style="height:450px">
      <div id = "sale_amount" class="chart-div"></div>
    </div>
  </div>
</div>



<div nz-col [nzLg] = "{span: 9}" [nzMd] = "{span: 9}" [nzSm] = "{span: 24}" [nzXs] = "{span: 24}" >
  <div nz-row style="margin-top: 40px">
    <div nz-col [nzSpan] = "11"  [nzOffset]="1" style="background-color: #ebc272;height:160px;color: white">
      <div nz-row  style="margin-right: 1em">
        <div nz-col [nzSpan] = "6"  [nzOffset]="2">
          <i class="anticon anticon-frown line1-ico"></i>
        </div>
        <div nz-col [nzSpan] = "16"  >
          <p class="line1-text-up text-right">今日失败交易&nbsp;</p>
          <p class="line1-text-down text-right" >12&nbsp;<span style="font-size: 0.5em;">次&nbsp;</span></p>
        </div>
      </div>
    </div>

    <div nz-col [nzSpan] = "11"  [nzOffset]="1" style="background-color: #659be0;height:160px;color: white">
      <div nz-row  style="margin-right: 1em">
        <div nz-col [nzSpan] = "6"  [nzOffset]="2">
          <i class="anticon anticon-line-chart line1-ico"></i>
        </div>
        <div nz-col [nzSpan] = "16"  >
          <p class="line1-text-up text-right">今日总访问量&nbsp;</p>
          <p class="line1-text-down text-right" >5.8&nbsp;<span style="font-size: 0.5em;">万&nbsp;</span></p>
        </div>
      </div>
    </div>
  </div>

  <div nz-row style="margin-top: 40px">
    <div nz-col [nzSpan] = "23"  [nzOffset]="1" style="height:350px;">
      <div id="content_trend"class="chart-div"></div>
    </div>
  </div>

  <div nz-row style="margin-top: 40px;height:450px">
    <div nz-col [nzSpan] = "23"  [nzOffset]="1" style="background-color: #36c6d3;height:100%">
      <div id = "content_rank"class="chart-div"></div>
    </div>
  </div>

</div>


<div nz-col [nzLg] = "{span: 5}" [nzMd] = "{span: 5}" [nzSm] = "{span: 24}" [nzXs] = "{span: 24}">
  <div style="margin-top: 40px;margin-left:30px;height: 550px">
    <div id="stay_time" class="chart-div">
    </div>
  </div>
  <div style="margin-top: 40px;margin-left:30px;height: 450px">
    <div id="sale_rank" class="chart-div"></div>
  </div>
</div>


<!--
[nzLg] = "{span: 5, offset: 1}" [nzMd] = "{span: 3, offset: 1}" [nzSm] = "{span: 0, offset: 1}" [nzXs] = "{span: 0, offset: 1}"-->


<!--
[nzLg] = "{span: 1}" [nzMd] = "{span: 1}" [nzSm] = "{span: 0}" [nzXs] = "{span: 0}"-->
